import 'package:constellation/global.dart';
import 'package:constellation/pages/luck_detail.dart';
import 'package:constellation/widgets/avatar.dart';
import 'package:flutter/material.dart';

class IndexPage extends StatefulWidget {
  IndexPage({Key key}) : super(key: key);
  @override
  _IndexPageState createState() => _IndexPageState();
}

class _IndexPageState extends State<IndexPage> {
  @override
  void initState() {
    super.initState();
  }

  modalChildren() {
    List<Widget> list = [];
    List.generate(Global.constellationList.length, (index) {
      var _data = Global.constellationList[index];
      list.add(
        InkWell(
          onTap: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => LuckPage(
                    enName: _data['en_name'], code: '0', index: _data['code']),
              ),
            );
          },
          child: Container(
            margin: EdgeInsets.all(10),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Avatar(
                  sex: 2,
                  index: _data['code'],
                  size: MediaQuery.of(context).size.width / 4.2,
                  shadow: false,
                ),
                SizedBox(height: 5),
                Text(
                  _data['name'],
                  style: TextStyle(
                    fontSize: 14,
                    fontWeight: FontWeight.w400,
                    color: Global.mainDarkColor,
                  ),
                ),
                SizedBox(height: 5),
                Text(
                  _data['date'],
                  style: TextStyle(
                    fontSize: 12,
                    fontWeight: FontWeight.w400,
                    color: Global.mainDarkColor.withOpacity(0.7),
                  ),
                ),
              ],
            ),
          ),
        ),
      );
    });
    return list;
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.of(context).size.width,
      height: MediaQuery.of(context).size.height,
      padding: EdgeInsets.fromLTRB(20, Global.paddingTop + 10, 20, 0),
      decoration: BoxDecoration(
        color: Global.backgroundColor,
        gradient: LinearGradient(
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
          colors: [
            Global.mainColor.withOpacity(0.5),
            Global.backgroundColor,
          ],
        ),
      ),
      child: SingleChildScrollView(
        child: Column(
          children: [
            Text(
              '选择星座',
              style: TextStyle(
                color: Global.mainColor,
                fontSize: 20,
              ),
            ),
            SizedBox(height: 20),
            Wrap(
              alignment: WrapAlignment.spaceBetween,
              children: modalChildren(),
            ),
          ],
        ),
      ),
    );
  }
}
